import {
  createRouter,
  createWebHistory,
  createWebHashHistory,
} from "vue-router";
import HomeView from "../views/HomeView.vue";
import LoginView from "@/views/LoginView.vue";
import SearchView from "@/views/SearchView.vue";
import DetailView from "@/views/DetailView.vue";
import NotFoundView from "@/views/NotFoundView.vue";

const router = createRouter({
  // history: createWebHashHistory(import.meta.env.BASE_URL), // 带#的
  history: createWebHistory(import.meta.env.BASE_URL),
  routes: [
    {
      path: "/",
      name: "home",
      redirect: "/home", // 如果访问的是 localhost:5173/#/ => localhost:5173/#/home
    },

    {
      path: "/login",
      name: "login",
      // component: LoginView,
      component: () => import("@/views/LoginView.vue"), // 懒加载
    },
    {
      path: "/home/:id?", // ?表示id可有可无
      name: "home",
      // component: HomeView,
      component: () => import("@/views/HomeView.vue"), // 懒加载
    },
    {
      path: "/search",
      // component: SearchView
      component: () => import("@/views/SearchView.vue"), // 懒加载
    },
    {
      path: "/detail/:name/:index",
      // component: DetailView
      component: () => import("@/views/DetailView.vue"), // 懒加载
    },
    {
      path: "/about",
      name: "about",
      // route level code-splitting
      // this generates a separate chunk (About.[hash].js) for this route
      // which is lazy-loaded when the route is visited.
      component: () => import("../views/AboutView.vue"),
    },
    {
      path: "/counter",
      component: () => import("@/views/CounterView.vue"),
    },
    {
      path: "/anothercounter",
      component: () => import("@/views/AnotherCounter.vue"),
    },
    {
      path: "/:pathMath(.*)*",
      // component: NotFoundView
      component: () => import("@/views/NotFoundView.vue"), // 懒加载
    },
  ], // 对应鸿蒙的router_map.json
}); // 创建路由实例对象

export default router; // 导出路由实例对象
